<script setup>
import { ElCard, ElButton, ElSpace, ElTag } from "element-plus";
import { ref, onMounted } from "vue";
import { summaryInvestExport, summaryInvestList } from "@/api/investPaper/";
import { investSummaryColumns } from "../columns";
import { useExport } from "@/hooks/useDaily";
import { getCurentDate, transformNumber } from "@/hooks/useCommon";
import CustomTable from "@/components/CustomTable";
const dataSource = ref([]);
const loading = ref(false);
const { curYear } = getCurentDate();
const getList = async () => {
  loading.value = true;
  const { data, code } = await summaryInvestList({ year: curYear }).finally(
    () => {
      loading.value = false;
    }
  );
  if (code != 200) return;
  dataSource.value = [...data];
};

const { onExport } = useExport({
  exportFn: summaryInvestExport,
  fileName: "年度汇总导出",
});
onMounted(() => getList());
const cellStyle = ({ row }) => {
  console.log();
  const isSum = row.name.indexOf("合计") > -1 ? true : false;
  return {
    background: isSum ? "#f5f5f5" : "",
  };
};
</script>

<template>
  <el-card shadow="hover" class="invest-card">
    <template #header>
      <div class="header_card">
        <h3>投资项目年度汇总表</h3>
        <el-space>
          <el-button type="primary" @click="onExport">导出</el-button>
        </el-space>
      </div>
    </template>

    <CustomTable
      v-loading="loading"
      class="custom_table"
      :height="dataSource.length > 7 ? '65vh' : '100%'"
      :selection="false"
      :indexWidth="50"
      :tableData="dataSource"
      :isPaging="false"
      :tableOption.sync="investSummaryColumns"
      border
      :cell-style="cellStyle"
    >
    </CustomTable>
  </el-card>
</template>

<style lang="scss" scoped>
@import "@/styles/investPaper.scss";

:deep(.el-table) {
  .el-table__row:nth-last-child(2),
  .el-table__row:nth-last-child(2) {
    border: 1px solid red;
  }
}
</style>
